<template>
    <div class="container">
        <div class="left-pane">
            <infinite-scroll></infinite-scroll>
        </div>
        <div class="right-pane">
            <chat-window></chat-window>
        </div>
    </div>
</template>

<script>
import InfiniteScroll from './InfiniteScroll.vue'
import ChatWindow from './ChatWindow.vue'

export default {
    components: { InfiniteScroll, ChatWindow },
    data() {
        return {}
    }
}
</script>

<style scoped>
.container {
    display: flex;
    height: 88vh;
}

.left-pane {
    width: 35%;
    border-right: 1px solid #ddd;
    overflow-y: auto;
}

.right-pane {
    width: 65%;
    overflow-y: auto;
}
</style>
